<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org" lang="zh-CN">
<head>
  <meta charset="UTF-8">
  <title>万东影院 | 管理员</title>
  <link th:href="@{/images/logo.svg}" rel="icon" type="image/svg+xml">
  <link th:href="@{/css/bootstrap.min.css}" rel="stylesheet">
  <link th:href="@{/css/bootstrap-icons.min.css}" rel="stylesheet">
</head>
<body>
<header>
  <ul class="nav nav-tabs m-2">
    <li class="nav-item">
      <a class="nav-link disabled">
        <i class="bi bi-person-circle"></i>
        <span class="ms-1">管理员</span>
      </a>
    </li>
    <li class="nav-item">
      <a class="nav-link" th:href="@{/admin/users}">
        <i class="bi bi-person-lines-fill"></i>
        <span class="ms-1">用户列表</span>
      </a>
    </li>
    <li class="nav-item">
      <a class="nav-link active">
        <i class="bi bi-person-fill"></i>
        <span class="ms-1">用户详情</span>
      </a>
    </li>
    <li class="nav-item">
      <a class="nav-link" th:href="@{/admin/log}">
        <i class="bi bi-journals"></i>
        <span class="ms-1">操作日志</span>
      </a>
    </li>
    <li class="nav-item ms-auto">
      <a class="nav-link" th:href="@{/me}">
        <i class="bi bi-person-gear"></i>
        <span class="ms-1">账号管理</span>
      </a>
    </li>
  </ul>
</header>
<main class="d-flex justify-content-center align-items-center">
  <div class="card w-25 mt-5">
    <div class="d-flex my-2">
      <a class="btn btn-link w-auto" th:href="@{/admin/users}">返回</a>
    </div>
    <div class="d-flex justify-content-center pb-3">
        <i class="bi bi-person-square" style="font-size: 50px"></i>
    </div>
    <div class="container p-3">
      <div class="d-flex flex-column gap-2">
        <div>
          <label class="small mb-1">用户 ID</label>
          <div class="card p-2">
            <span th:text="${user.getId()}"></span>
          </div>
        </div>
        <div>
          <label class="small mb-1">用户名</label>
          <div class="card p-2">
            <span th:text="${user.getUsername()}"></span>
          </div>
        </div>
        <div>
          <label class="small mb-1">身份</label>
          <div class="card p-2">
            <span th:text="${user.getRole().getDisplayName()}"></span>
          </div>
        </div>
        <div>
          <label class="small mb-1">手机号</label>
          <div class="card p-2">
            <span th:text="${user.getPhoneNumber()}"></span>
          </div>
        </div>
        <div>
          <label class="small mb-1">创建时间</label>
          <div class="card p-2">
            <span th:text="${user.getCreatedAt()}"></span>
          </div>
        </div>
      </div>
    </div>
  </div>
</main>
<script th:src="@{/js/axios.min.js}"></script>
<script th:src="@{/js/bootstrap.bundle.min.js}"></script>
<script>

</script>
</body>
</html>